@extends('manage.layout')

@section('content')
    <div class="content">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                角色列表&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="/system/role/add" class="btn btn-primary">添加角色</a>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                <li><a href="#">role</a></li>
            </ol>
            {{--<div class="input-group margin">--}}
                {{--<form action="{{ url('admin/manage') }}" method="post" >--}}
                    {{--{{ csrf_field() }}--}}
                    {{--<select style="width: 150px"  name="searchtype" class="form-control">--}}
                        {{--@foreach($manages['searchtype'] as $value)--}}
                            {{--<option value="{{ $value['id'] }}">{{ $value['searchtype'] }}</option>--}}
                        {{--@endforeach--}}
                    {{--</select>--}}
                    {{--<input style="width: 200px"  name="param" type="text" class="form-control">--}}
                    {{--<input  type="submit" class="btn btn-info btn-flat" value="Go!">--}}
                {{--</form>--}}
            {{--</div>--}}
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header with-border">
                            <h3 class="box-title">内容</h3>
                        </div>
                        <span id="msg" style="display: none">
                            @if (count($errors) > 0)
                                @foreach ($errors->all() as $error)
                                    <div style="width: 100%;">
                                        <span style="color: red;display: block;margin: 0px auto;width: 200px;text-align: center;">{{ $error }}</span>
                                    </div>
                                @endforeach
                            @else
                                <div style="width: 100%;">
                                    <span style="color: green;display: block;margin: 0px auto;width: 200px;text-align: center;">{{ Session::get('msg') }}</span>
                                </div>
                            @endif
                        </span>
                        <script type="text/javascript">
                            var _msg = $('#msg div span').text();
                            console.log(_msg);
                            if(_msg != ''){
                                layer.msg(_msg);
                            }
                        </script>
                        <!-- /.box-header -->
                        <div class="box-body">
                            <table class="table table-bordered table-hover"  style=" text-align: center;">
                               <tr>
                                    @foreach($navigation as $value)
                                        <th style="text-align:center">{{ $value['navigation'] }}</th>
                                    @endforeach
                                    <th style="text-align: center;">操作</th>
                                </tr>
                                @foreach($roleInfo as $role)
                                    <tr>
                                        <td>{{ $role['id'] }}</td>
                                        {{--<td>{{ $role['create_time']}}</td>--}}
                                        <td>{{ $role['update_time']}}</td>
                                        <td>{{ $role['rank']}}</td>
                                        <td>{{ $role['name']}}</td>
                                        <td>
                                            @if($role['status'] == 0)
                                                <label>禁用</label>
                                            @elseif($role['status'] == 1)
                                                <label>启用</label>
                                            @endif
                                        </td>
                                        <td  style="text-align:center;">
                                            @if($role['status'] == 0)
                                                <a class="btn btn-success btn-xs"  onclick="setStatus('{{$role['id']}}',1)">启用<a>
                                            @elseif($role['status'] == 1)
                                                <a class="btn btn-warning btn-xs"  onclick="setStatus('{{$role['id']}}',0)">禁用<a>
                                            @endif
                                            {{--<a class="btn btn-warning btn-xs"  href="{{ url('system/role/getRole/'.$role['id']) }}">修改密码<a>--}}
                                            <a class="btn btn-danger btn-xs" onclick="configAdmin({{$role['id']}})" data-toggle="modal" data-target="#myModal">人员设置</a>
                                            <a class="btn btn-danger btn-xs" onclick="deleteRole({{$role['id']}})">删除</a>

                                        </td>
                                    </tr>
                                @endforeach
                            </table>
                        </div>
                        <div calss="pages" style="text-align: center;">
                            {{ $roleInfo->links() }}
                        </div>

                        <!-- /.box -->
                    </div>
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
                        <div class="modal-dialog" style="width: 80%;">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                        &times;
                                    </button>
                                    <h4 class="modal-title" id="myModalLabel">
                                        角色人员选择
                                    </h4>
                                </div>
                                <div class="modal-body">
                                    <div class="row">

                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                                    </button>
                                    <button type="button" class="btn btn-primary" id="sub_btn" data-dismiss="modal">
                                        提交更改
                                    </button>
                                </div>
                            </div><!-- /.modal-content -->
                        </div><!-- /.modal -->
                    </div>

                    <!-- /.row -->

        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
@stop
@section('script')
    <script>
        function deleteRole(id) {
            layer.confirm('删除后不可恢复，是否继续?', {
                btn:['确定','取消']
            },function() {
                $.ajax({
                    url: '/system/role/delRole',
                    type: "GET",
                    data: {id:id},
                    dataType: "json",
                    success: function(res) {
                        console.log(res);
                        if(res.error == 0) {
                            window.location.href = "/system/role";
                            layer.msg(res.msg)
                        }
                        else {
                            layer.msg(res.msg)
                        }
                    }
                });
            });
        }
        
        function configAdmin(id) {
            //获取所有人员
            $.ajax({
                url: '/system/role/getAllUser',
                type: "GET",
                data: {id:id},
                dataType: "json",
                success: function(res) {
                    console.log(res);
                    var item = "";
                    for(var i=0;i<res.length;i++){
                        if(res[i]['is_check']){
                            item = item + '<div class="col-lg-6" style="width: 10%;float: left;"><div class="input-group"><span class="input-group-addon"><input type="checkbox" name="admin_ids" value="'+res[i]['id']+'" checked></span><input type="text" class="form-control" value="'+res[i]['nickname']+'"></div></div>';
                        }else {
                            item = item + '<div class="col-lg-6" style="width: 10%;float: left;"><div class="input-group"><span class="input-group-addon"><input type="checkbox" name="admin_ids" value="'+res[i]['id']+'"></span><input type="text" class="form-control" value="'+res[i]['nickname']+'"></div></div>';
                        }
                    }
                    item = item + '<input type="hidden" id="hid_id" value="'+id+'"/>';
                    $(".modal-body .row").html(item);
                }
            });
        }
        $("#sub_btn").click(function () {
            var chk_value =[];
            $('input[name="admin_ids"]:checked').each(function(){
                chk_value.push($(this).val());
            });
            var id = $("#hid_id").val();
            var _token = '{{csrf_token()}}';
            $.ajax({
                url: '/system/role/setAdminRole',
                type: "POST",
                data: {admin_ids:chk_value,id:id,_token:_token},
                dataType: "json",
                success: function(res) {
                $("#myModal").modal('hide');
                }
            });
        });
        //禁用,启用
        function setStatus(id,status) {
            $.ajax({
                url: '/system/role/setStatus',
                type: "GET",
                data: {id:id,status:status},
                dataType: "json",
                success: function(res) {
                    console.log(res);
                    if(res.error == 0) {
                        window.location.href=window.location.href;
                        layer.msg(res.msg, {time:1500, icon:1})
                    }
                    else {
                        layer.msg(res.msg, {time:1500, icon:2})
                    }
                }
            });
        }
    </script>
@stop
